	<!--<script src="js/contact.api.js"></script>
	<script src="js/contact.domain.js"></script>
	<script src="js/Init.js"></script>-->
	<style type="text/css">
		.contacts_panel{
			position:relative;
			border-right: 1px solid #EFEFEF;
			float: left;  
			width:256px;
		}
		/*contacts to custom css*/
		.contacts_panel_functions{
			width: 100%; 
		}
		.contacts_font_color{
			color:#000;
		}
		.contacts_panel_bg_color{
			background-color: #ededed; 
		}
		#contacts_tooltip_img{
        	display: none;
        	position:relative;
        	left:20px;
        	top: 0px;
        	z-index : 99999997;
        	text-align:left
        }
        #contacts_extend_tooltip_img{
        	display: none;
        	position: relative;
        	left:20px;
        	top: 0px;
        	z-index: 99999997;
        	text-align:left
        }
        #contacts_tooltip_img li{
        	/*width:195px;*/
        	word-wrap:break-word;
        	text-align:justify;
        	list-style: none;
        	line-height:18px;
        }
        #contacts_extend_tooltip_img li{
        	word-wrap:break-word;
        	text-align:justify;
        	list-style: none;
        }
		.contacts_panel_top{
			color:white; 
			position:relative;
			text-align: center; 
			background-color: #44b6ff; 
		}
		.wp_contacts_title{
			line-height: 20px;
		}
		.panel_title_class1{
            vertical-align:top;
			text-align:center;
			left: 100px;
            position: absolute;
        }
		.panel_title_class2{
            vertical-align:top;
			text-align:center;
			left: 350px;
            position: absolute;
        }
        .wp_contacts_hand{
			 cursor:pointer;
		}

		/*#contacts_menubar_filter {color: #77b359; }
    	#contacts_menubar_filter .k-animation-container{width: 87px !important; }
    	#contacts_menubar_filter .k-animation-container ul{ width: 87px !important;}*/
		/*.contacts_panel_functions .k-input{
			background-color:#77b359!important;
			border: 0!important;
		}*/
		/*.contacts_panel_functions .k-state-focused{
			box-shadow: none!important;
			-webkit-box-shadow: none!important;
		}
		.contacts_panel_functions .k-select{
			box-shadow: none!important;
			-webkit-box-shadow: none!important;
		}*/
		/*.contacts_panel_functions .k-item, .k-state-selected, .k-state-selected:link, .k-state-selected:visited, .k-list > .k-state-selected, .k-list > .k-state-highlight, .k-panel > .k-state-selected, .k-ghost-splitbar-vertical, .k-ghost-splitbar-horizontal, .k-draghandle.k-state-selected:hover, .k-scheduler .k-scheduler-toolbar .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-marquee-color{
			background-color: #fff;
    		border-color: #fff;
    		color: #000000;
		}*/
		.contacts_topic{
			position: absolute;
			left: 540px;
		}
		.contacts_frequent{
			position: absolute;
			left: 640px;
		}
		.contacts_time{
			position: absolute;
			left: 590px;
		}
		.contacts_search_button{
			background-color: #00aaff!important;
		}
		/*.user_icon img {
			vertical-align: middle;
		}
		.user_icon tn {
			position: relative;
			top: -46px;
			left: 29px;
			width:3px;
			height: 8px;
			display: inline-block;	
			text-shadow: 0 1px 1px rgba(0,0,0,.2);
			padding: 2px 5px;
			line-height: 8px;
			border-radius: 2px;
			box-shadow: 0 1px 2px rgba(0,0,0,.2);
			background-color: #d94b4b;
		}
		.user_icon tn span {
			position: relative;
			margin-left:-2px;
		}
		.user_icon bc {
			position: relative;
			width:0px;
			height: 6px;
			top: -14px;
			left: 14px;
			display: inline-block;	
			text-shadow: 0 1px 1px rgba(0,0,0,.2);
			padding: 1px 4px;
			line-height: 12px;
			border-radius: 2px;
			box-shadow: 0 1px 2px rgba(0,0,0,.2);
			background-color: #ff8400;
		}*/
		.contacts_panel_body{height: 100%; }
		#contacts_search_view{
			display: none;
		}


		#contacts_main_order_by_name{color: white; display: none; }
		.contacts_min_panel_icon{display:block; margin:0 auto;}
		

		.contacts_max_panel_emailphone_font{line-height: 12px;}
		.wp_w_55_3{width: 55.3px; } .margin_020{margin: 0 20px; }
		
		#contacts_detail_window {
    			border: 1px solid #EAEAEA;
		}
		.wp_mt_ne10{
			margin-top: -10px;
		}
		
		/*.contacts_button{
			background-color: #77b359!important;
		}*/
		#contacts_order_by_time{color: white;}
		#contacts_order_by_frequent{color: white;}
		
		
		.text_one_line_overflow {
			  display:block;
			  word-break:keep-all;
			  white-space:nowrap;
			  overflow:hidden;
			  text-overflow:ellipsis;
			  -o-text-overflow:ellipsis
		}
		.contacts_input_color{
			color: black;
		}
		
		#contacts_search_view .k-i-calendar{display: none;}
		#contacts_search_view .k-select{width: 100%;}
		.contacts_hr{height:1px;border:none;border-top:1px solid #e5e5e5;}
		#contacts_search_result_back{color: #4bb3fc;text-decoration: none;}

		#contacts_alpa_search{
			overflow: hidden;
		}
		#contacts_alpa_search ul{
            position: absolute;
		    left: 233px;
		    top: 45px;
		    text-align: center;
		    height:93%;
		    font-size: 14px;
        }
        #contacts_alpa_search li{
            cursor: pointer;
            list-style: none;
            border-bottom: 1px solid #ededed;
            color: #000;
            width: 15px;
        }
        
        #contacts_no_alpha_result{
        	position: absolute;
        	z-index: 999999;
        	left: 18px;
        	top: 60px;
        	font-size: 14px;
        	display: none;
        }
        #contacts_search_zero_result{
        	position: absolute;
        	z-index: 99999997;
        	left: 25px;
        	top: 150px;
        	font-size: 14px;
        	display: none;
        }
        .ocsIcon{
        	position: relative;
			top: -15px;
			left: 28px;        	
        }
        #contacts_menubar_filter {color: black; }
    	#contacts_menubar_filter .k-animation-container{width: 87px !important;margin:2px 0px 0px 0px !important;}
   	 	#contacts_menubar_filter .k-animation-container ul{ width: 87px !important;}
   	 	.contacts_fixedwidth{width: 82px !important; overflow: hidden; height: 16px !important;white-space:nowrap;text-overflow:ellipsis;background: #77b359;color:#fff;}
    	.contacts_controlIcon{ float: right;  margin: -8px 2px 0px 2px !important;}
    	#contacts_menubar_filter{
    		position: absolute;
        	z-index: 99999998;  
        }
        .contacts_font_color a:link{color: #000; text-decoration:none;}
		.contacts_max_panel_emailphone_font a:link{color: #000; text-decoration:none;}
		.contacts_no_result_p {
        	text-align: center;
			text-overflow: ellipsis;
			width: 700px;
			word-wrap: break-word;
		}
		.hangoutspanMax{
			width: 16px;
			height: 16px;
			position: relative;
			left: 30px;
        	top: -13px;
        	overflow: hidden;
		}
		.hangoutspanMin{
			width: 16px;
			height: 16px;
			position: relative;
			left: 30px;
        	top: -13px;
        	overflow: hidden;
        }
        .hangoutspanMin iframe{
        	opacity: 0
        }
        .hangoutspanMax iframe{
        	opacity: 0
        }
        .hangout_img{
        	position: absolute;
        	top: 0px;
        	left: 0px;
        }
        #time_out_message{
        	word-wrap:break-word;
        	text-align:justify;
        	list-style: none;
        	font-size: 12px;
        	width: 225px;
        }
        .contact_font_bold{font-weight:bold;}
	</style>
	
	<div class="contacts_panel_div contacts_panel" id="contacts_panel">  
		<div class="contacts_panel_top wp_h_20 wp_fz_14 wp_contacts_title">
			<span id="contacts_title" class="panel_title_class1">Contacts</span>
			<i id="contacts_panel_resize_icon" class="main_common_f_13_13 panel_resize right wp_mr_5 wp_mt_3 wp_contacts_hand" title="Expand"></i>
		</div>

		<div class="contacts_panel_functions contacts_panel_bg_color wp_h_30 wp_pt_10">
			<!--<div id="filterMenu" class="left wp_ml_17">
                <ul id="contacts_menubar_filter" class="wp_fz_10 wp_h_16 wp_w_82"></ul>
			</div>-->
			<!-- <div id="contacts_sorting_panel" class="left wp_w_605 wp_h_18 wp_fz_11 wp_ml_260 ">
				<span id="contacts_sorting_frequent" class="wp_contacts_hand contacts_frequent wp_mt_5" onclick="wp_contacts_main.clickFrequentSorting()">Frequent
					<i id="contacts_sorting_frequent_icon" class="wp_ml_3 wp_mt_3 right main_icon_e_6_8"></i>
				</span>
				<span id="contacts_sorting_time" class="wp_contacts_hand contacts_time wp_mt_5" onclick="wp_contacts_main.clickTimeSorting()">Time
					<i id="contacts_sorting_time_icon" class="wp_ml_3 wp_mt_3 right main_icon_e_6_8"></i>
				</span>
				<span id="contacts_sorting_topic" class="wp_contacts_hand left contacts_topic wp_mt_5" onclick="wp_contacts_main.clickTopicSorting()">Topic
					<i id="contacts_sorting_topic_icon" class="wp_ml_3 wp_mt_3 right main_icon_e_6_8"></i>
				</span>
			</div> -->
			<i id="contacts_search" title="Search" class="main_common_j_11_11 right wp_mr_10 wp_mt_5 wp_contacts_hand"  onclick="wp_contacts_main.openOrCloseSearchPanel()"></i>
			<i class="main_common_h_11_11 wp_contacts_hand right wp_mt_5 wp_mr_20" onclick="wp_contacts_main.addYourContacts()" title="Add Contacts" style="display: block;"></i>
			
			<span id="contacts_no_alpha_result" class="contacts_font_color wp_w_210"></span>
		</div>
		<div id="time_out_message" class="contacts_font_color"></div>
		<div id="contacts_search_view" class="wp_w_768 contacts_panel_bg_color wp_pb_15 left">
			<span type="text" class="left wp_ml_17 wp_fz_13 wp_mt_3 contacts_font_color">User Name&nbsp;&nbsp;</span>
			<div class="k-textbox wp_searchbar">
	            <input id="contacts_search_username" type="text" maxlength="255" onkeypress="wp_contacts_main.enterSearchBtn(event)">
	            <i class="k-icon k-i-search left wp_contacts_hand" id="contact_search_btn" title="Search" onclick="wp_contacts_main.clickSearchIcon()">&nbsp;</i>
	        </div>
			<hr class="contacts_hr wp_w_743 wp_mt_9 wp_mb_10 left">
			<div class="wp_w_700 wp_ml_17 wp_h_20 wp_mb_10 left" id="contacts_search_result_view">
		    	<a class="wp_fz_12 wp_contacts_hand" id="contacts_search_result_back" onclick="wp_contacts_main.clickBackToAll()">Back to all</a>
		    	<span class=" wp_fz_12 contacts_font_color">&nbsp;&gt;&nbsp;Showing&nbsp;<span  data-bind="text: resultcount" id="contacts_search_result_count"></span>&nbsp;result(s) for&nbsp;<span id="contacts_search_result_keywords" data-bind="text: keywords"></span></span>
			</div>
			<span id="contacts_search_zero_result" class='contacts_font_color contacts_highlight contacts_no_result_p'></span>
		</div>
		<div id="contacts_tooltip_img" class="wp_fz_14 wp_w_210 contacts_font_color">
			<ul>
				<li class='contact_font_bold'>To add new Contacts:</li>
				<li style='line-height:5px;'>&nbsp;</li>
				<li>1. Press "+" to search for new Contacts.</li>
				<li>2. Click on the other user’s profile and click “Add to my contacts” in their profile.</li>
				<li>3. The contact will now be added in your Contacts Panel.</li>
			</ul>
		</div>
		<div id="contacts_extend_tooltip_img" class="wp_fz_14 contacts_font_color">
			<ul>
				<li class="wp_ml_15">You are yet to have followers.</li>
				<li class="wp_ml_15">You can actively participate in communities to have followers.</li>
			</ul>
		</div>
		<div id="contacts_alpa_search" data-alpa-name="contacts_alpa_search">	
			<div id="contacts_min_panel_div" class="contacts_panel_body contacts_panel_bg_color wp_pl_7 wp_pr_15"></div>
			<div id="contacts_max_panel_div" class="contacts_panel_body contacts_panel_bg_color wp_pl_16 wp_pr_25"></div>
		</div>
	</div>
	<script type="text/x-kendo-template" id="contacts_panel_min_template">
		<div class="left wp_h_60 wp_pl_10 wp_mb_24 wp_mt_2" style="#: data.mid_mar # ">
			<div class="left wp_w_40">
				<img class="wp_w_40 wp_h_40 wp_mb_24 wp_contacts_hand "  src="#: data.UserImageUrl #" onerror="onContactsDefaultThumbnailWanted(this)" onclick="wp_contacts_main.openContactDetail(this, '#:data.UserId#')" >
				#if(Workport.getBrowser() == 'ie10' || Workport.getBrowser() == 'ie11'){#
					<div class="hangoutspanMin">
						<img name="#: data.EmailId #" class="hangout_img wp_contacts_hand" src="imgs/contacts_hangout.jpg" onclick="wp_contacts_main.chartToEmail(this,'#:data.EmailId#')">
					</div>
				#}else{#
					<div class="hangoutspanMin">
						<img name="#: data.EmailId #" class="hangout_img" src="imgs/contacts_hangout.jpg">
						<g:hangout render="createhangout"  invites="[{ id : '#:data.EmailId#', invite_type : 'EMAIL' }]"></g:hangout>
						
					</div>
				#}#	
				<!--<div id='imnimage' style="display:none"><a class="wp_contacts_hand" href="javascript:" onclick="IMNImageOnClick();return false;"><span>
					#if(wp_contacts_main.getBrowserType()){#
						<img name="upi" height="12" class="ocsIcon" style="visibility:visible" id="user_#: data.UserId #" onload="IMNRC('#: data.EmailId #')" src="imgs/SPPresence/IMNHDR.GIF" border="0" sip="#: data.EmailId #" showofflinepawn="1" />
					#}else{#
						<img name="upi" height="12" class="ocsIcon" style="visibility:hidden" id="user_#: data.UserId #" onload="IMNRC('#: data.EmailId #')" src="imgs/SPPresence/IMNHDR.GIF" border="0" sip="#: data.EmailId #" showofflinepawn="1" />
					#}#
				</span></a></div>-->
			</div>
			<div class="left wp_w_151 wp_ml_15 wp_mt_3 contacts_content_div">
				<div class="contacts_font_color wp_mt_ne6">
					<span class="wp_w_130 wp_h_20 left wp_lh_20 wp_fz_12 wp_contacts_hand text_one_line_overflow contacts_highlight" title="#: data.UserName #" onclick="wp_contacts_main.openContactDetail(this, '#:data.UserId#')">
						#=wp_contacts_main.getUNHighlightHtml(data.UserName, wp_contacts_main.get_letter(), true)#
					</span>
					<div class="clear"></div>
			 	</div>
			 	<p class="contacts_font_color wp_fz_11 text_one_line_overflow" title="#: data.MobilePhone #" onclick="">#: data.MobilePhone #</p>
			 	#if(wp_contacts_main.validataGMail()){#
			 		<p class="contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow" title="#: data.EmailId #" onclick="wp_contacts_main.clickGMail('#:data.EmailId#')">#: data.EmailId #</p>
			 	#}else{#
			 		<p class="contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow" title="#: data.EmailId #" onclick=""><a class='contacts_font_color' href="mailto: #:data.EmailId#">#: data.EmailId #</a></p>
			 	#}#
			 	<!--<p class="contacts_max_panel_emailphone_font contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow">
			 	<a title="#: data.EmailId #" id="mailTo#: data.UserId #" href="javascript:wp_contacts_main.clickGMail('#: data.UserId #', '#: data.EmailId #');">#: data.EmailId #</a>
			 	</p>-->
			</div>
		</div>
	</script>

	<script type="text/x-kendo-template" id="contacts_panel_max_template">	
		<div class="left wp_h_60 wp_mt_2">
			<div class="left wp_w_40">
				<img class="wp_w_40 wp_h_40 wp_contacts_hand"  src="#: data.UserImageUrl #" onerror="onContactsDefaultThumbnailWanted(this)" onclick="wp_contacts_main.openContactDetail(this, '#:data.UserId#')" >
				#if(Workport.getBrowser() == 'ie10' || Workport.getBrowser() == 'ie11'){#
					<div class="hangoutspanMax">
						<img name="#: data.EmailId #" class="hangout_img wp_contacts_hand" src="imgs/contacts_hangout.jpg" onclick="wp_contacts_main.chartToEmail(this,'#:data.EmailId#')">
					</div>
				#}else{#
					<div class="hangoutspanMax">
						<img name="#: data.EmailId #" class="hangout_img" src="imgs/contacts_hangout.jpg">
						<g:hangout render="createhangout"  invites="[{ id : '#:data.EmailId#', invite_type : 'EMAIL' }]"></g:hangout>
					</div>
				#}#	
				<!--<div id='imnimage' style="display:none"><a class="wp_contacts_hand" href="javascript:" onclick="IMNImageOnClick();return false;"><span>
					#if(wp_contacts_main.getBrowserType()){#
						<img name="upi" height="12" class="ocsIcon" style="visibility:visible" id="user_#: data.UserId #" onload="IMNRC('#: data.EmailId #')" src="imgs/SPPresence/IMNHDR.GIF" border="0" sip="#: data.EmailId #" showofflinepawn="1" />
					#}else{#
						<img name="upi" height="12" class="ocsIcon" style="visibility:hidden" id="user_#: data.UserId #" onload="IMNRC('#: data.EmailId #')" src="imgs/SPPresence/IMNHDR.GIF" border="0" sip="#: data.EmailId #" showofflinepawn="1" />
					#}#
				</span></a></div>-->
			</div>
			<div class="left wp_w_181 wp_ml_15 wp_mt_3 contacts_content_div">
				<div class="contacts_font_color wp_fz_12 wp_mt_ne6">
					<span class="wp_w_130 wp_h_20 left wp_lh_20 wp_contacts_hand text_one_line_overflow contacts_highlight" title="#: data.UserName #" onclick="wp_contacts_main.openContactDetail(this, '#:data.UserId#')">#=wp_contacts_main.getUNHighlightHtml(data.UserName, wp_contacts_main.get_letter(), true)#</span>
					<div class="clear"></div>
			 	</div>
			 	<p class="contacts_max_panel_emailphone_font contacts_font_color wp_fz_11 text_one_line_overflow" title="#: data.MobilePhone #" onclick="">#: data.MobilePhone #</p>
			 	#if(wp_contacts_main.validataGMail()){#
			 		<p class="contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow" title="#: data.EmailId #" onclick="wp_contacts_main.clickGMail('#:data.EmailId#')">#: data.EmailId #</p>
			 	#}else{#
			 		<p class="contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow" title="#: data.EmailId #" onclick=""><a class='contacts_font_color' href="mailto: #:data.EmailId#">#: data.EmailId #</a></p>
			 	#}#
			 	<!--<p class="contacts_max_panel_emailphone_font contacts_font_color wp_fz_11 wp_contacts_hand text_one_line_overflow">
			 	<a title="#: data.EmailId #" id="mailTo#: data.UserId #" href="javascript:wp_contacts_main.clickGMail('#: data.UserId #', '#: data.EmailId #');">#: data.EmailId #</a>
			 	</p>-->
			</div>
		</div>
	</script>

    <script>
    var wp_contacts_main = (function() {
    	var minPageTmpl = $('#contacts_min_panel_div');
        var minDataTmpl = $('#contacts_panel_min_template');
        var maxPageTmpl = $('#contacts_max_panel_div');
        var maxDataTmpl = $('#contacts_panel_max_template');
        var allMyContactsStartCount = 10;
        var myContactsOffset = 0;
        var isEndMyContacts = false;
        var fileterVal = 2;
        var alert_title = "Error Message";
        var maxStartCount = Math.ceil((Screen.bodyHeight - $('#wp_header').height()) / 60 * 3);
	    var minStartCount = Math.ceil((Screen.bodyHeight - $('#wp_header').height()) / 60);
        var allContactsOffset = 0;
    	var letterSearchTool;
	    var oldAllAppList;
	    var newALLAppList;
	    var isEndAll=false;
	   	var isFirstLoad=true;
		var oldContactsList;
		var newContactsList;
		var isShowUserNameInfo=false;
		var filterMenu_i = 1,filterMenu_menu = [{id:'.v0', val:2},{id:'.v1', val:12},{id:'.v2', val:1}];
		var filterMenu_ds ={
            text:"Following",
            value:"12",
            cssClass:'v'+filterMenu_i,
            items:[{text:'Following',value:2,cssClass:'.v0'},{text: "Followers", value:"1",cssClass:'.v2'}]
        };
        var _offset = 0;
        var _pageSize = 10;
        // var _filter = 2;
        var _userId = '%7BuserIdkey%7D';
        var _position = '%7BpositionKey%7D';
        var reqdata = {};
        var letter = '';
        var loading;
        var useragent = Workport.getBrowser();
        var inputUsername = '';
        
        function getReqdata(offset, pageSize, filter, userName, action, userId, position){
        	var reqdata = {};
        	if(!userName){
        		userName = null;
        		action = null;
        	}
        	if(!userId){
        		userId = null;
        	}
        	if(!position){
        		position = null;
        	}
        	reqdata = { offset:offset, pageSize:pageSize, filter:filter, userName:userName, action:action, userId:userId, position:position};
        	return reqdata;
        }

		function onSelect(e) {
			var item = $(e.item);
            var _txt = item.find('span').text() ;

            if(_txt.length < 20){

                $('#contacts_menubar_filter').find('span:first').html('<span class="k-icon k-i-arrow-s right" ></span>'+(_txt == 'Following' ? 'Following' : _txt));
            }
            var classes = item.attr('class').split(' ');
            var csel = 2;
            if($.inArray('.v0',classes) !== -1){

            }else{
                $.map(classes,function(c){
                	if(c.indexOf('.v') === 0){
	                	$.map(filterMenu_menu,function(_item){
	                        if(c == _item.id){
	                            csel =  _item.val;
	                        }
	                    });
                    }
                });
            }
            if((csel == 2 && _txt =='Following' ) || (csel != 2 && _txt != 'Following')){
            	fileterVal = csel;
            	letter = '';
            	$('#contacts_no_alpha_result').hide();
            	hideTooltip();
            	wp_contacts_main.letterSearchControl();
            	if($('#contacts').width()==256){
					minFilterContacts(0, minStartCount, csel);
	        	}else{
					maxFilterContacts(0, maxStartCount, csel);
				}
            }
        }
 		
 		function hideTooltip(){
 			$('#contacts_extend_tooltip_img').hide();
			$('#contacts_tooltip_img').hide();
 		}

        function wp_contacts_filterMenu(){
			$("#contacts_menubar_filter").kendoMenu({
                dataSource:filterMenu_ds,
                select:onSelect
            });
            if(navigator.userAgent.indexOf("Firefox")>0){
            	$('#contacts_menubar_filter').find('span:eq(0)>span').addClass('contacts_controlIcon');
            }else{
            	$('#contacts_menubar_filter').find('span:eq(0)>span').addClass('k-icon k-i-arrow-s right');
            }
            $('#contacts_menubar_filter').find('span:eq(0)').addClass('contacts_fixedwidth');
           
        }

        function minFilterContacts(offset, pageSize, filter){
        	contacts_closeSearchPanel();
		    wp_contacts_main.render([],minDataTmpl,minPageTmpl);
		    wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
        	reqdata = getReqdata(_offset, minStartCount, filter);
			Workport.ContactAPI.getSelfContact(getMinContactsListCallback,reqdata);
        }

        function maxFilterContacts(offset, pageSize, filter){
        	contacts_closeSearchPanel();
		    wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
		     wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
        	reqdata = getReqdata(_offset, maxStartCount, filter);
			Workport.ContactAPI.getSelfContact(getMaxContactsListCallback,reqdata);
        }

        function contacts_zoomin_cb () {
	        $('.contacts_panel_div').addClass('wp_p_max');
	        $('.contacts_panel_div').css({width:"768"});
         	$("#contacts_title").removeClass('panel_title_class1');
	        $("#contacts_title").addClass('panel_title_class2');
	        wp_contacts_enlargeIwantoPanel();
	        $("#contacts_main_order_by_name").css({display:"inline"});
	        $("#contacts_panel_resize_icon").toggleClass("main_common_f_13_13 main_common_m_13_13");
            $("#contacts_panel_resize_icon").attr("title",'Collapse');
	    }

	    function contacts_zoomout_cb() {
	        $('.contacts_panel_div').removeClass('wp_p_max');
	        $('.contacts_panel_div').css({width:"256"});
	        $("#contacts_title").removeClass('panel_title_class2');
	        $("#contacts_title").addClass('panel_title_class1');
	        wp_contacts_decreaseIwantoPanel();
	        $("#contacts_main_order_by_name").css({display:"none"});
	        $("#contacts_panel_resize_icon").toggleClass("main_common_f_13_13 main_common_m_13_13");
            $("#contacts_panel_resize_icon").attr("title",'Expand');
	    }

	    function wp_contacts_enlargeIwantoPanel(){
			wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
			$("#contacts_max_panel_div").parent().show();
			$("#contacts_min_panel_div").parent().hide();
			$('#contacts_alpa_search').css('width',"768");
			$('#contacts_alpa_search').find('ul').css("left","745px");
			$('#contacts_tooltip_img').hide();
			$('#contacts_no_alpha_result').hide();
			letterSearchTool.update();
			letterSearchTool.cancleHighLight();
			letter = '';
			$('#contacts_sorting_panel').show();
			// Call getSelfContact API
			wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
			wp_contacts_main.hideTimeoutMesg();
			reqdata = getReqdata(_offset, maxStartCount, fileterVal);
			Workport.ContactAPI.getSelfContact(getMaxContactsListCallback,reqdata);	
		}

		function wp_contacts_decreaseIwantoPanel(){
			wp_contacts_main.render([],minDataTmpl,minPageTmpl);
			$("#contacts_max_panel_div").parent().hide();
			$("#contacts_min_panel_div").parent().show();
			contacts_closeSearchPanel();
			$('#contacts_alpa_search').css('width',"256");
			$('#contacts_alpa_search').find('ul').css("left","233px");
			$('#contacts_no_alpha_result').hide();
			if(fileterVal == 1){
				$('#contacts_extend_tooltip_img').css("top",0);
			}else{
				$('#contacts_tooltip_img').css("top",0);
			}
			letter = '';
			wp_contacts_main.letterSearchControl();
			wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
			wp_contacts_main.hideTimeoutMesg();
			$('#contacts_sorting_panel').hide();
			// Call getSelfContact API
			reqdata = getReqdata(_offset, minStartCount, fileterVal);
			Workport.ContactAPI.getSelfContact(getMinContactsListCallback,reqdata);	
		}

		//call back of API
		function getMinContactsListCallback(data, httpCode){
			// data = {
			// 		"SelfContacts":[
			// 		{
			// 		"UserId":"12345",
			// 		"UserName":"xyz",
			// 		"EmailId":"xyz@Cognizant.com",
			// 		"UserImageUrl":"URL",
			// 		"MobilePhone":"044-5623213",
			// 		"Flag":"Follower",
			// 		"RowNo":7
			// 		}],
			// 		ResponseCode: "WP1003", 
			// 		ResponseMessage: "Success"};
			loading.hide();
			// httpCode.status = 408;
			if(getHttpCodeStatus(httpCode)){
				wp_contacts_main.showTimeoutMesg('min');
				return;
			}else{
				wp_contacts_main.hideTimeoutMesg();
			}
			if(data){
				if(data.ResponseCode == "WP1008"){
					hideTooltip();
					if(myContactsOffset == 0){
						wp_contacts_main.render(contacts_handel_style_of_datasource(data.SelfContacts, "min"), minDataTmpl, minPageTmpl);
						oldContactsList = data.SelfContacts;
			  			if(data.SelfContacts.length < minStartCount){
			  				myContactsOffset = 0; 
			  				allMyContactsStartCount = minStartCount;
			  				isEndMyContacts = true;
			  			}else{
			  				myContactsOffset = data.SelfContacts[data.SelfContacts.length - 1].RowNo;
			  				allMyContactsStartCount = minStartCount;
			  				isEndMyContacts = false;
			  			}
			  		}else{
			  			var oldCount = oldContactsList.length;
		  				newContactsList = oldContactsList.concat(data.SelfContacts);
	  					myContactsOffset = data.SelfContacts[data.SelfContacts.length - 1].RowNo;
	  					oldContactsList = newContactsList;
	  					wp_contacts_main.render(contacts_handel_style_of_datasource(data.SelfContacts,"newmin",oldCount),minDataTmpl,minPageTmpl);
					}
					if(reqdata.username == ''){
						reqdata = getReqdata(myContactsOffset, allMyContactsStartCount, fileterVal);
					}else{
						reqdata.offset = myContactsOffset;
					}
				}else if(data.ResponseCode == "WP2021"){
					if(myContactsOffset == 0){
						if(fileterVal == 2){
							$('#contacts_tooltip_img').css("left",20);
							$('#contacts_tooltip_img').find("li").eq(1).css("width", 190);
							$('#contacts_tooltip_img').find("li").eq(2).css("width", 195);
							$('#contacts_tooltip_img').find("li").eq(3).css("width", 195);
							$('#contacts_tooltip_img').find("li").eq(4).css("width", 195);
							$('#contacts_tooltip_img').show();
						}else if(fileterVal == 1){
							$('#contacts_extend_tooltip_img').css("left",20);
							$('#contacts_extend_tooltip_img').find("li").eq(1).css("width", 185);
							$('#contacts_extend_tooltip_img').show();
						}
					}
				}else if(data.ResponseCode == "WP1003"){
					if(myContactsOffset == 0){
						if(fileterVal == 2){
							$('#contacts_tooltip_img').css("left",20);
							$('#contacts_tooltip_img').find("li").eq(1).css("width", 190);
							$('#contacts_tooltip_img').find("li").eq(2).css("width", 195);
							$('#contacts_tooltip_img').find("li").eq(3).css("width", 195);
							$('#contacts_tooltip_img').find("li").eq(4).css("width", 195);
							$('#contacts_tooltip_img').show();
						}else if(fileterVal == 1){
							$('#contacts_extend_tooltip_img').css("left",20);
							$('#contacts_extend_tooltip_img').find("li").eq(1).css("width", 185);
							$('#contacts_extend_tooltip_img').show();
						}
					}
					isEndMyContacts = true;
				}else{
					Workport.utils.alertMsg(alert_title,data.ResponseMessage,function(_data){});
				}
			}
		}

		function getMaxContactsListCallback(data, httpCode){
			// data = {
			// 		"SelfContacts":[
			// 		{
			// 		"UserId":"12345",
			// 		"UserName":"xyz",
			// 		"EmailId":"xyz@Cognizant.com",
			// 		"UserImageUrl":"URL",
			// 		"MobilePhone":"044-5623213",
			// 		"Flag":"Follower",
			// 		"RowNo":7
			// 		}],
			// 		ResponseCode: "WP1003", 
			// 		ResponseMessage: "Success"};
			loading.hide();
			// httpCode.status = 408;
			if(getHttpCodeStatus(httpCode)){
				wp_contacts_main.showTimeoutMesg('max');
				return;
			}else{
				wp_contacts_main.hideTimeoutMesg();
			}

			if(data){
				if(data.ResponseCode == "WP1008"){
					hideTooltip();
					if(allContactsOffset == 0){
			  			wp_contacts_main.render(contacts_handel_style_of_datasource(data.SelfContacts,"max"),maxDataTmpl,maxPageTmpl);
			  			oldAllAppList = data.SelfContacts;
			  			if(data.SelfContacts.length < maxStartCount){
			  				allContactsOffset = 0;
			  				allMyContactsStartCount = maxStartCount;
			  				isEndAll = true;
			  			}else{
			  				allContactsOffset = data.SelfContacts[data.SelfContacts.length - 1].RowNo;;
			  				allMyContactsStartCount = maxStartCount;
			  				isEndAll = false;
			  			}
			  		}else{
			  			var oldCount = oldAllAppList.length;
		  				newALLAppList = oldAllAppList.concat(data.SelfContacts);
	  					allContactsOffset = data.SelfContacts[data.SelfContacts.length - 1].RowNo;
	  					oldAllAppList = newALLAppList;
		  				wp_contacts_main.render(contacts_handel_style_of_datasource(data.SelfContacts,"newmax",oldCount),maxDataTmpl,maxPageTmpl);
			  		}
			  		if(reqdata.username == ''){
						reqdata = getReqdata(allContactsOffset, allMyContactsStartCount, fileterVal);
					}else{
						reqdata.offset = allContactsOffset;
					}
				}else if(data.ResponseCode == "WP1003"){
					if(allContactsOffset == 0){
						if(fileterVal == 1){
							$('#contacts_extend_tooltip_img').css("left",279);
							$('#contacts_extend_tooltip_img').find("li").eq(1).css("width", 400);
							$('#contacts_extend_tooltip_img').show();
						}else if(fileterVal == 2){
							$('#contacts_tooltip_img').css("left",150);
							$('#contacts_tooltip_img').find("li").eq(1).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(2).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(3).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(4).css("width", 500);
							$('#contacts_tooltip_img').show();
						}
					}
					isEndAll = true;
				}else if(data.ResponseCode == "WP2021"){
					if(allContactsOffset == 0){
						if(fileterVal == 1){
							$('#contacts_extend_tooltip_img').css("left",279);
							$('#contacts_extend_tooltip_img').find("li").eq(1).css("width", 400);
							$('#contacts_extend_tooltip_img').show();
						}else if(fileterVal == 2){
							$('#contacts_tooltip_img').css("left",150);
							$('#contacts_tooltip_img').find("li").eq(1).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(2).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(3).css("width", 500);
							$('#contacts_tooltip_img').find("li").eq(4).css("width", 500);
							$('#contacts_tooltip_img').show();
						}
					}
				}else{
					Workport.utils.alertMsg(alert_title,data.ResponseMessage,function(_data){});
				}
			}
		}

		//contacts data model
		function contacts_handel_style_of_datasource(datasource,flag,oldLength){
			if(flag=="oldmax"){
				for(var i=0;i<datasource.length;i++){
					if(i==1 ||i%3==1){
						datasource[i].mid_mar="margin-left:50px;margin-right:50px;";
					}else{
						datasource[i].mid_mar="";
					}
				}
			}else if(flag=="newmin"){
				for(var i=oldLength;i<(datasource.length+oldLength);i++){
					if(i==1){
						datasource[i-oldLength].mid_mar="";
					}
				}
			}else if(flag=="newmax"){
				for(var i=oldLength;i<(datasource.length+oldLength);i++){
					if(i==1 ||i%3==1){
						datasource[i-oldLength].mid_mar="margin-left:50px;margin-right:50px;";
					}
				}
			}else{
				for(var i=0;i<datasource.length;i++){
					if(i==1 ||i%3==1){
						if(flag=="max"){
							datasource[i].mid_mar="margin-left:50px;margin-right:50px;";
						}
					}
				}
			}
			return datasource;
		}

	    function contacts_closeSearchPanel(){
			$("#contacts_search_view").hide();
			$("#contacts_search_result_view").hide();
		}

		function RefreshOCSStatus() {
            $("img[name^='upi']").each(
	       		 function (i, elem) {
	       		 	if(elem.attributes.getNamedItem('sip') != null){
	       		 		var eSipId = elem.attributes.getNamedItem('sip').nodeValue;
			            var eid = elem.id;
			            IMNRC(eSipId, eid);
	       		 	}
	       	});
        }

		return {
			getUNHighlightHtml:function(un,key,isBlankComma){
				reg = /^[a-zA-Z]{1,}$/;
				if(key && reg.test(key)){					
					var h='';
				   	if(un && 0 < un.length){
				   		if(isBlankComma){
				   			//-----------blank---comma----------------
							var leg = 0;
							var comma = un.indexOf(','); 
							var uns = un.split(/[ ,]/); 
							$.each(uns,function(index,value){
						     	value = value.trim();
								if(key.toLowerCase() == value.substring(0,key.length).toLowerCase()){
						      		h += '<font style="color:red;">'+value.substring(0,key.length)+'</font>'+value.substring(key.length);
						     	}else{
						      		h += value;
						     	}
						     	if(0 <= index){
						     		if(index == 0)
						     			leg += value.length;
						     		else
						     			leg += value.length + 1;
						     		if(leg == comma){
						     			h += ',';
						     		}else{
						     			h += ' ';
						     		}
						     	}
						    });

							//------------------------------
				   		}else{
				   			var uns = un.split(',');
						    $.each(uns,function(index,value){
						     	if(0<index){
						       		h += ',';
						     	}
						     	value = value.trim();
								if(key.toLowerCase() == value.substring(0,key.length).toLowerCase()){
						      		h += '<font style="color:red;">'+value.substring(0,key.length)+'</font>'+value.substring(key.length);
						     	}else{
						      		h += value;
						     	}
						    });
				   		}
						
				    }

				    return h;
				}else{
					return un;
				}
			   	
			},
			getBrowserType:function(){
				var browser = Workport.getBrowser();
				if(browser == 'ie10' || browser == 'ie11'){
					return true;
				}else{
					return false;
				}
			},
			get_letter:function(){
				return letter;
			},
			get_contacts_zoomin_cb:function(){
				allContactsOffset = 0 ;
				myContactsOffset=0;
				if(useragent == 'ipad'){
					$('#contacts_min_panel_div').hide();
					$('#contacts_max_panel_div').show();
					contacts_zoomin_cb();
					$('#contacts_alpa_search').css('display','block');
				}else{
					$('#contacts_min_panel_div').slimScroll({ scrollTo: '-500px',disableFadeOut:true });
					contacts_zoomin_cb();
				}
				
				
			},
			showTimeoutMesg:function(str){
				if(str =='min'){
					$('#contacts_panel').find('#time_out_message').css("margin",'0');
					$('#contacts_panel').find('#time_out_message').css("width","225px");
				}else{
					$('#contacts_panel').find('#time_out_message').css("margin",'0 150px');
					$('#contacts_panel').find('#time_out_message').css("width","445px");
				}
				$('#contacts_panel').find('#time_out_message').css("display","block");
				$('#contacts_panel').find('#time_out_message').text(WP_TIMEOUT_MESSAGE);
			},
			hideTimeoutMesg:function(){
				$('#contacts_panel').find('#time_out_message').css("display","none");
			},
			get_contacts_zoomout_cb:function(){
				allContactsOffset = 0 ;
				myContactsOffset=0;
				if(useragent == 'ipad'){
					$('#contacts_alpa_search').css('display','block');
					$('#contacts_max_panel_div').hide();
					$('#contacts_min_panel_div').show();
					contacts_zoomout_cb();
				}else{
					$('#contacts_max_panel_div').slimScroll({ scrollTo: '-500px',disableFadeOut:true });
					contacts_zoomout_cb();
				}
				
			},
			// clickFrequentSorting:function(){
			// 	$("#contacts_sorting_frequent_icon").toggleClass("main_icon_f_6_8 main_icon_e_6_8");
			// },
			// clickTimeSorting:function(){
			// 	$("#contacts_sorting_time_icon").toggleClass("main_icon_f_6_8 main_icon_e_6_8");
			// },
			// clickTopicSorting:function(){
			// 	$("#contacts_sorting_topic_icon").toggleClass("main_icon_f_6_8 main_icon_e_6_8");
			// },
			addYourContacts:function(){
				if($('#contacts').width()==256)
					wp_contacts_add.createWindow(wp_contacts_main.clickAllinMin);
				else
					wp_contacts_add.createWindow(wp_contacts_main.clickAllinMax);
			},
			getMinContactsList:function(){
				wp_contacts_main.showLoading(loading,$('#contacts_panel'),true,true,true);
				Workport.ContactAPI.getSelfContact(getMinContactsListCallback,reqdata);
			},
			getMyContactsEndFlag:function(){
				return isEndMyContacts;
			},
			getMaxContactsList:function(){
				wp_contacts_main.showLoading(loading,$('#contacts_panel'),true,true,true);
				Workport.ContactAPI.getSelfContact(getMaxContactsListCallback,reqdata);
			},
			enterSearchBtn:function(event){
			    var keycode
			    if(window.event) // IE 
			    {
			        keycode = event.keyCode
			    }
			    else if(event.which) // Netscape/Firefox/Opera
			    {
			        keycode = event.which
			    }
			    if(keycode==13) //Enter key
			    {
			        this.clickSearchIcon();
			    }
		    },
		    clickBackToAll:function(){
		    	contacts_closeSearchPanel();
		    	wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
		    	wp_contacts_enlargeIwantoPanel();
		    },
			clickSearchIcon:function(){
				hideTooltip();
				var username = $.trim($('#contacts_search_username').val());
				username = $.param({key: $.trim(username)}).substring(4);
				// var	regNL = /^[a-zA-Z0-9]{3,255}$/;
	    	    var tooltip_empty = $("#contacts_search_username").kendoTooltip({
									content: 'Please enter the keywords.' ,
									position: "right",
									showOn: false,
									show: function() {
											isShowUserNameInfo=true;
										},
									hide: function() {
											isShowUserNameInfo=false;
										}
								}).data('kendoTooltip');
	    	    var tooltip_length = $("#contacts_search_username").kendoTooltip({
									content: 'Must enter atleast 3 characters.' ,
									position: "right",
									showOn: false,
									show: function() {
											isShowUserNameInfo=true;
										},
									hide: function() {
											isShowUserNameInfo=false;
										}
								}).data('kendoTooltip');
	    	  //  var tooltip_NL = $("#contacts_search_username").kendoTooltip({
								// 	content: 'Enter the correct user name.' ,
								// 	position: "right",
								// 	showOn: false,
								// 	show: function() {
								// 			isShowUserNameInfo=true;
								// 		},
								// 	hide: function() {
								// 			isShowUserNameInfo=false;
								// 		}
								// }).data('kendoTooltip');
	    	   	$("#contacts_search_username").on('input',function(e){
	    	   		tooltip_empty.hide();  
					tooltip_length.hide();
					// tooltip_NL.hide();
				}); 
	    	   	if(username.length == 0){
    	    		if(!isShowUserNameInfo){
						tooltip_empty.show();
                        $(".k-tooltip-content").attr("id","contacts_search_tooltip");
					}
    	    	}else if(username.length > 0 && username.length < 3){
    	    		if(!isShowUserNameInfo){
						tooltip_length.show();
					}
    	    	}else{
    	    		wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
    	    		// if(regNL.test(username)){
    	    			wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
    	    			reqdata = getReqdata(_offset, maxStartCount, fileterVal, username, 0, _userId, _position);
	    	    		Workport.ContactAPI.getSelfContact(function(data, httpCode){
	    	    			loading.hide();
							if(data){
								if(data.ResponseCode && data.ResponseCode=="WP1008"){
									wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
									$('#contacts_search_zero_result').hide();
									var searchData = data.SelfContacts;
									$('#contacts_search_result_keywords').text($('#contacts_search_username').val());
									$('#contacts_search_result_count').text(searchData.length);
									$('#contacts_search_result_view').show();
									wp_contacts_main.render(contacts_handel_style_of_datasource(searchData,"max"),maxDataTmpl,maxPageTmpl);
									$('.contacts_highlight').highlight($.trim($('#contacts_search_username').val()));
									if(searchData.length < reqdata.pageSize){
			        	    			reqdata.offset = 0;
			        	    		}else{
			        	    			reqdata.offset += searchData.length
			        	    		}
								}else if(data.ResponseCode=="WP1003"){
									$('#contacts_search_result_keywords').text($('#contacts_search_username').val());
									$('#contacts_search_result_count').text(0);
									$('#contacts_search_result_view').show();
									wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
									$('#contacts_search_zero_result').text("No results for "+$('#contacts_search_username').val()+".");
									$('#contacts_search_zero_result').show();
									$('.contacts_highlight').highlight($.trim($('#contacts_search_username').val()));
								}else{
									Workport.utils.alertMsg(alert_title,data.ResponseMessage,function(_data){});
								}
							}
						},reqdata);
    	 //    		}else{
    	 //    			if(!isShowUserNameInfo){
						// 	tooltip_NL.show();
						// }
    	 //    		}
    	    	}
    	    },
    	    openOrCloseSearchPanel:function(){
		    	// contacts_closeSearchPanel();
		    	wp_contacts_main.letterSearchControl();
		    	$("#contacts_search_result_view").hide();
				hideTooltip();
				$('#contacts_search_zero_result').hide();
				if($('#contacts').width()==256){
					$('#contacts_panel_resize_icon').click();
					$('#contacts_search_view').toggle();
				}
				$("#contacts_search_username").val("");
				if(!$('#contacts_search_view').is(":hidden")){
					$('#contacts_no_alpha_result').hide();
					if(fileterVal == 1){
						$('#contacts_extend_tooltip_img').css("top",0);
					}else{
						$('#contacts_tooltip_img').css("top",0);
					}
				}else{
					if(fileterVal == 1){
						$('#contacts_extend_tooltip_img').css("top",0);
					}else{
						$('#contacts_tooltip_img').css("top",0);
					}
				}
				if($('#contacts_max_panel_div').find("div").length == 0){
					if(letter != "All"){
						$('#contacts_no_alpha_result').hide();
						$('#contacts_search_view').show();
					}
					return;
				}else{
					$('#contacts_search_view').toggle();
				}
			},
			clickAllinMax:function(){
				
				allContactsOffset = 0 ;
				myContactsOffset=0;
				$('#contacts_no_alpha_result').hide();
				wp_contacts_main.openOrCloseSearchPanel();
				wp_contacts_main.letterSearchControl();
				wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
				wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
				reqdata = getReqdata(_offset, maxStartCount, fileterVal);
				Workport.ContactAPI.getSelfContact(getMaxContactsListCallback,reqdata);
				letter = '';
			},
			clickAllinMin:function(){
				letter = '';
				allContactsOffset = 0 ;
				myContactsOffset=0;
				$('#contacts_no_alpha_result').hide();
				wp_contacts_main.letterSearchControl();
				wp_contacts_main.render([],minDataTmpl,minPageTmpl);
				wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
				reqdata = getReqdata(_offset, minStartCount, fileterVal);
				Workport.ContactAPI.getSelfContact(getMinContactsListCallback,reqdata);
			},

			letterSearchControl:function(){
				if(letterSearchTool){
					letterSearchTool.update();
					letterSearchTool.cancleHighLight();
				}
			},

			geAllEndFlag:function(){
				return isEndAll;
			},
			clickGMail:function(userId, emailId){
				elem = $('#mailTo'+userId);
				Workport.ProfileAPI.getProperty(function (data){
					var isGmail = false;
					if (data) {
                    	$.grep(data.UserBasicDetailsProperty, function (_val, _index){
                    		if(_val.Name == 'Mail Type' &&  _val.Value == 'Gmail'){
                    			isGmail = true;
                    		}
                    	});
                    	if(isGmail){
                    		elem.attr("href", "javascript:void(0);");
                    		elem.click(function(){
                    			gmailControler.composeMessage({to: emailId});
                    		}).trigger('click');
                    	}else{
                    		elem.attr("href", "mailto:" + emailId);      
                    		elem.trigger('click');
                    		elem.get(0).click();
                    	}
                    }
                },{'userId': userId});			
			},
			clickGMail:function(emailId){
				gmailControler.composeMessage({to: emailId});
			},
			validataGMail:function(){
				var isGmail = false;
				if(WP_MAIL_TYPE == 'Gmail'){
					isGmail = true;
				}
				return isGmail;
			},
			openContactDetail:function(element,appid) {
				if($('#contacts').width()==256){
					homepageProfileWin.user_info_win_create(appid, false, wp_contacts_main.clickAllinMin);
				}
				else{
					homepageProfileWin.user_info_win_create(appid, false, wp_contacts_main.clickAllinMax);
				}
			},
		   
			//-----------------------------------------init function---------------------------------
			init:function(){
				$('#contacts_alpa_search').height(Workport.utils.getViewPort().height-120);
                var self = this; 
                minPageTmpl.off("*");
                minPageTmpl.empty();
                if(!loading){loading = new Workport.Loader($('#contacts_panel'));}
                // $('#contacts_panel').appendTo('#contacts');
                $('#contacts').html($('#contacts_panel'));
				var width = $(window).width();
				var height = Screen.bodyHeight;
				$('.contacts_panel_div').css({
					width:"256",
					height:"100%"
				});
				if(useragent == 'ipad'){
					$('#contacts_min_panel_div').css('height',(height-60)+'px');
					$('#contacts_max_panel_div').css('height',(height-60)+'px');
					$('#contacts_max_panel_div').css('width','725px');
					$('#contacts_min_panel_div').css('overflow-y','scroll'); 
					$('#contacts_max_panel_div').css('overflow-y','scroll');
					$("#contacts_min_panel_div").bind("scroll",function(){
		                if( ($("#contacts_min_panel_div")[0].scrollHeight <= $("#contacts_min_panel_div").scrollTop() + $("#contacts_min_panel_div").height()) &&!self.getMyContactsEndFlag()  ){
		                      self.getMinContactsList();
		                   }
                 	}); 
	                $("#contacts_max_panel_div").bind("scroll",function(){
						 if( ($("#contacts_max_panel_div")[0].scrollHeight <= $("#contacts_max_panel_div").scrollTop() + $("#contacts_max_panel_div").height()) &&!self.geAllEndFlag()  ){
		                       self.getMaxContactsList();
		                    }
	                });
				} else{
					$('#contacts_min_panel_div').slimScroll({
					 		height: (height-60)+'px',
							disableFadeOut:true
					 		
					});
					$('#contacts_max_panel_div').slimScroll({
						 		height: (height-60)+'px',
								disableFadeOut:true,
						 		width:'768px'
					});

					$('#contacts_min_panel_div').slimScroll().bind('slimscroll', function(e, pos){
			 				if(pos=="bottom"&&!self.getMyContactsEndFlag()){
			 					 self.getMinContactsList();
			 				}
					});

					$('#contacts_max_panel_div').slimScroll().bind('slimscroll', function(e, pos){
							if(pos=="bottom"&&!self.geAllEndFlag()){
			 					 self.getMaxContactsList();
			 				}
			 		});
				}
				

		        HomePage_Scrollable.registerZoomCallback(WPMoudleManager.getModule('contacts').index, self.get_contacts_zoomin_cb, self.get_contacts_zoomout_cb);
				$('#contacts_panel_resize_icon').bind({
					click:function(e){
						hideTooltip();
						HomePage_Scrollable.zoom(WPMoudleManager.getModule('contacts').index);
		                return;
					}
				});
				hideTooltip();
				wp_contacts_decreaseIwantoPanel();
				wp_contacts_filterMenu();
				// getBrowserType();
	            
				var contacts_letter=Letter('#contacts_alpa_search',function(_letter){
					$("#contacts_search_view").hide();
					hideTooltip();
					if(_letter=="#"){
						reqdata = getReqdata(_offset, _pageSize, fileterVal, 'others', 0, _userId, _position);
					}else{
						reqdata=getReqdata(_offset, _pageSize, fileterVal, _letter, 1, _userId, _position);
					}
					letter = _letter;

		    	    		
					if($('#contacts').width()==256){
						self.render([],minDataTmpl,minPageTmpl);
		    	    	if(_letter=="All"){
		    	    		self.clickAllinMin();
		    	    		$('#contacts_min_panel_div').slimScroll({ scrollTo: '-500px',disableFadeOut:true });
		    	    		$('#contacts_no_alpha_result').hide();
		    	    	}else{
		    	    		wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
		    	    		reqdata.pageSize = minStartCount;
		    	    		Workport.ContactAPI.getSelfContact(function(searchData, httpCode){
		    	    			loading.hide();
		    	    			if(searchData){
									if(searchData.ResponseCode=="WP1008"){
				        	    		self.render(contacts_handel_style_of_datasource(searchData.SelfContacts,"min"),minDataTmpl,minPageTmpl);
				        	    		$('#contacts_no_alpha_result').hide();
				        	    		if(searchData.SelfContacts.length < reqdata.pageSize){
				        	    			reqdata.offset = 0;
				        	    		}else{
				        	    			reqdata.offset += searchData.SelfContacts.length
				        	    		}
				        	    	}else if(searchData.ResponseCode=="WP1003"){
				        	    		if(_letter=="#"){
				        	    			$('#contacts_no_alpha_result').text("No Contacts found starting with numerics or special characters.");	
				        	    			$('#contacts_no_alpha_result').css("width",210);		
				        	    		}else{
				        	    			$('#contacts_no_alpha_result').text("No contacts found starting with "+_letter);
				        	    		}
				        	    		$('#contacts_no_alpha_result').css("left",18);
				        	    		$('#contacts_no_alpha_result').show();
				        	    	}else{
				        	    		Workport.utils.alertMsg(alert_title,searchData.ResponseMessage,function(_data){});
				        	    	}
				        	    }
			        	    },reqdata);
		    	    	}
		    	    }else{
		    	    	wp_contacts_main.render([],maxDataTmpl,maxPageTmpl);
		    	    	if(_letter=="All"){
		    	    		self.clickAllinMax();
		    	    		$('#contacts_min_panel_div').slimScroll({ scrollTo: '-500px',disableFadeOut:true });
		    	    		$('#contacts_no_alpha_result').hide();
		    	    	}else{
		    	    		wp_contacts_main.showLoading(loading,$('#contacts_panel'),false,true,true);
		    	    		reqdata.pageSize = maxStartCount;
		    	    		Workport.ContactAPI.getSelfContact(function(searchData, httpCode){
		    	    			loading.hide();
		    	    			if(searchData){
									if(searchData.ResponseCode=="WP1008"){
				        	    		self.render(contacts_handel_style_of_datasource(searchData.SelfContacts,"max"),maxDataTmpl,maxPageTmpl);
				        	    		$('#contacts_no_alpha_result').hide();
				        	    		if(searchData.SelfContacts.length < reqdata.pageSize){
				        	    			reqdata.offset = 0;
				        	    		}else{
				        	    			reqdata.offset += searchData.SelfContacts.length
				        	    		}
				        	    	}else if(searchData.ResponseCode=="WP1003"){
				        	    		if(_letter=="#"){
				        	    			$('#contacts_no_alpha_result').text("No Contacts found starting with numerics or special characters.");	
				        	    			$('#contacts_no_alpha_result').css("left",219);
				        	    			$('#contacts_no_alpha_result').css("width",400);		
				        	    		}else{
				        	    			$('#contacts_no_alpha_result').text("No contacts found starting with "+_letter);
				        	    			$('#contacts_no_alpha_result').css("left",279);
				        	    		}
				        	    		$('#contacts_no_alpha_result').show();
				        	    	}else{
				        	    		Workport.utils.alertMsg(alert_title,searchData.ResponseMessage,function(_data){});
				        	    	}
				        	    }
							},reqdata);
		    	 		}
		    	    }
				},'#ffffff');
				letterSearchTool=contacts_letter;
				contacts_letter.update(); 
				
            },

            showLoading: function(loader,element,isDown,iswhite,isblack){
				if(loader){
					if(isDown){
						loader.setContent(element,{
												position:'down',
												textCSS:{'display':'none','color':iswhite?'black':'white'}
						});
					}else{
						if(isblack){
							loader.setContent(element,{
								imgColor:'black',textCSS:{'color':'black'}, boxCSS:{'opacity':0}
							});
						}else{
							loader.setContent(element,{
									position:'center',
									textCSS:{'display':'block','color':iswhite?'black':'white'}
							});
						}
					}
					loader.show();
				}
			},

            render: function(_data,dataTmpl,pageTmpl) {
            	if(_data && _data.length==0){
            		pageTmpl.off("*");
                    pageTmpl.empty();
            	}else{
            		var tmpl = kendo.template($.trim(dataTmpl.html()));
	                var arr = new Array();
	                $.map(_data, function(_elem) {
	                    arr.push(tmpl(_elem));
					});
	                $(arr.join('')).appendTo(pageTmpl);
	                RefreshOCSStatus();
	                if(Workport.getBrowser() == 'ie10' || Workport.getBrowser() == 'ie11'){
	                	return;
	                }else{
	                	if(typeof(gapi.hangout) != 'undefined'){
		                    gapi.hangout.go();
		                };
	                }
	            }
	        },
			chartToEmail: function (e, workEmail) {
				if($(e).parent().find('div').length == 0){
					$(e).parent().append('<g:hangout render="createhangout"  invites="[{ id : \'' + workEmail + '\', invite_type : \'EMAIL\' }]"></g:hangout>');
				    if(typeof(gapi.hangout) != 'undefined'){
	                    gapi.hangout.go();
	                };
				}
			}
			//-----------------------------------------init function end-------------------------------------


		};//rerurn end
    })();

    
	wp_contacts_main.init();

	function onContactsDefaultThumbnailWanted(element) {
		  if (element == undefined) {
		      return;
		  }
		  $(element).attr('src', 'imgs/40.png');
	}


	
</script>
	
